<template>
  <div>
    <li class="myInfo_warp_li" @click="goPageLink(pageLink)">
      <div class="myInfo_warp_li_left">
        <van-icon v-show="iconType==='0'" name="paid" />
        <van-icon v-show="iconType==='1'" name="friends-o" />
        <van-icon v-show="iconType==='2'" name="share-o" />
        <van-icon v-show="iconType==='3'" name="records" />
        <van-icon v-show="iconType==='4'" name="warning-o" />
        <van-icon v-show="iconType==='5'" name="diamond-o" />
        <span class="mwl_left_text">{{ lTitle }}</span>
      </div>
      <div class="myInfo_warp_li_right">
        <span class="mwl_right_text" :class="{otherStyleColor:otherColor}">{{ rDesc }}</span>
        <van-icon name="arrow" />
      </div>
    </li>

  </div>
</template>

<script>
export default {
  name: 'PageLink',
  components: {},
  props: {
    lTitle: {
      type: String,
      default: '',
    },
    rDesc: {
      type: String,
      default: '',
    },
    iconType: {
      type: String,
      default: '-1',
    },
    otherColor: {
      type: Boolean,
      default: false,
    },
    pageLink: {
      type: String,
      default: '',
    },
  },
  data() {
    return {
    }
  },
  computed: {},
  create() {
  },
  mounted() {
  },
  methods: {
    goPageLink(value) {
      this.$router.push({ name: value })
    },
  },
}
</script>

<style scoped lang="scss">
  @import "../assets/style/base";
  .myInfo_warp_li{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: pxTorem(24px) pxTorem(30px);
    border-bottom: 1px solid #dcdcdc;
    .myInfo_warp_li_left{
      font-size: pxTorem(32px);
      font-weight: 600;
      color: #333333;
      display: flex;
      align-items: center;
      .mwl_left_text{
        margin-left: pxTorem(8px);
      }
    }
    .myInfo_warp_li_right{
      font-size: pxTorem(28px);
      display: flex;
      align-items: center;
      color: #999999;
      .mwl_right_text{}
      .mwl_right_img{}
      .otherStyleColor{
        color: #ffcc00;
      }
    }
  }

</style>
